<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>新闻中心</title>
    <link rel="stylesheet" href="css/style_newsdetail.css">
    <link rel="stylesheet" href="css/style_about.css">
    <style>
        [v-clock]{
            display: none;
        }
    </style>
    <script type="text/javascript">
        function goBottom() {/* 向下跳转*/
            window.scrollTo(0, document.documentElement.scrollHeight-document.documentElement.clientHeight);
        }
    </script>
</head>
<body>
<!--导航栏-->
<div class="top_bar">
    <span><img src="img/LOGO.jpg" width="240" height="60" alt="云端工作室"></span>
    <ul class="nav">
        <li><a class="on" href="index.html" style="text-decoration: none">首　页</a></li>
        <li><a href="gzsbk.html">工作室板块</a></li>
        <li><a href="news.html" style="color: #67b803">新闻中心</a></li>
        <li><a href="human_resources.html" >人力资源</a></li>
        <li><a href="study.html">学习板块</a></li>
        <li><a href="javascript:void(0)" onclick="goBottom()">联系我们</a></li>
    </ul>
</div>
<div class="null"></div>

<div class="news_title" style="text-align: center">
    <h2>新闻</h2>
    <a>提供最全面的云端就业工作室和云端科技有限公司的动态</a>
</div>
<div id="news" v-clock>
    <div class="news_list" v-for="item in newsList" :key="item.id">
        <div class="date">
            <h1>{{item.createTime.substring(0,4)}}</h1>
            <h2>{{item.createTime.substring(5,10)}}</h2>
        </div>
        <span>
                <a href="" :title="item.title">
                    <img :src="item.picture" width="180" height="120" :alt="item.title" class="dh"></a>
            </span>
        <ul>
            <li><a :href="item.url" :title="item.title"><h3 style="white-space:nowrap;overflow: hidden;text-overflow:ellipsis;padding-bottom: 10px">
                {{item.title}}</h3></a></li>
            <li  style="overflow: hidden;text-overflow:ellipsis;">{{item.context}}</li>
        </ul>
    </div>
    <br><br>
</div>
    <!--置顶按钮-->
    <div class="bottom-bar-item" style="float:right;">
        <a href="#"><img src="img/up_arrow1.png" alt="" style="padding: 7px;"></a>
    </div>
<!--联系我们-->
<div class="blackscreen1">
    <div class="blackscreen2">
        <ul class="item2" style="padding-left: 100px">
            <a class="bottom_title" style="font-size: 23px;padding-right:20px;color: #FFFFFF;"><br>上级部门</a><br>
            <a href="http://www.gogotoo.net/" target="_blank">云端科技有限公司</a><br>
            <a>招生就业处</a>
        </ul>
        <ul class="item1">
            <a class="bottom_title" style="font-size: 23px;color: #FFFFFF;padding-left: 70px;"><br>关于</a><br>
            <a href="study.html">学习板块</a><br>
            <a href="competition.html">比赛项目</a><br>
            <a href="news.html" >新闻中心</a><br>
            <a href="human_resources.html">人力资源</a><br>
        </ul>
        <div style="float: left;padding-top:75px">
            <img src="img/LOGO2.png" style="width: 360px;height: 100px;padding-right: 0px">
        </div>
        <ul class="item3" style="padding-left: 65px">
            <a class="bottom_title" style="font-size: 23px;color: #FFFFFF;"><br>联系我们</a><br>
            <a>QQ:1352834940</a><br>
            <a>邮箱:1352834940@qq.com</a><br>
            <a>微信:hy15180043828</a><br>
            <a>电话:15180043828</a><br>
        </ul>
        <ul class="item4" style="padding-left: 60px">
            <a class="bottom_title" style="font-size: 23px;color: #FFFFFF;"><br>友好社团</a><br>
            <a>爱心公益协会</a><br>
            <a>鸣鹿工作室</a><br>
            <a>巅峰之家</a><br>
            <a>南昌工程学院军官教导团</a><br>
        </ul>
    </div>
</div>
</div>

<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
<script src="https://unpkg.com/axios/dist/axios.min.js"> </script>
<script>
    const news = new Vue({
        el:"#news",
        data: {
            newsList:[],
        },
        methods: {

        },
        // methods:{
        //     getData:function () {
        //         var that = this;
        //         that.$http({
        //             method:"get",
        //             url:"",
        //             headers:{},
        //         }).then((res) => {
        //                 console.log(res);
        //                 that.newsList = res.data;
        //             }).catch(e=>{
        //                 console.log(e);
        //         })
        //     }
        // },
        created:function() {
            var that = this;
            axios.get("/allNews").then(res => {
                // console.log(res.data);
                that.newsList = res.data.data;
            }).catch(e => {
                console.log(e);
            })
        }
    });
</script>
</body>
</html>